<template>
	<div class="app-container">
		<!-- 高级查询 -->
		<p>信用额度申请详细</p>
      <p> <el-button type="primary"   icon="el-icon-edit" @click="handleProve">审核通过</el-button>
    </p>
		<el-divider></el-divider>
		<div>
			<div class="moneyBox">
				<div class="moneyChildBox">
					<div class="textAlLine eduTitle">授信额度</div>
					<div class="titleNumber textAlLine"> {{ finCustomerCreditApplication.needCredit }}<span
							style="color: #818181;margin-left: 10px;">元</span> </div>
				</div>
				<div class="moneyChildBox">
					<div class="textAlLine eduTitle">申请理由</div>
					<div class="titleNumber textAlLine redColor">{{ finCustomerCreditApplication.applyReason }}<span
							style="color: #818181;margin-left: 10px;"></span> </div>
				</div>
				<div class="moneyChildBox">
					<div class="textAlLine eduTitle">审核状态</div>
					<div class="titleNumber textAlLine">{{ finCustomerCreditApplication.proveStatus }}<span
							style="color: #818181;margin-left: 10px;"></span> </div>
				</div>
				<div class="moneyChildBox">
					<div class="textAlLine eduTitle">申请人</div>
					<div class="titleNumber textAlLine">{{ finCustomerCreditApplication.customerName }}<span
							style="color: #818181;margin-left: 10px;"></span>
					</div>
				</div>
			</div>
    <el-divider />
    <div v-if="finCustomerCreditApplication.applyAttachmentUrl" class="contentBox">
      <img style="width: 50%; height: 50%;" :src="attachUrl(finCustomerCreditApplication.applyAttachmentUrl)">
    </div>
   </div>

  <div class="dialog_container">
    <!--保理公司审核-->
    <el-dialog
      :title="proveDialog.title"
      :close-on-click-modal="false"
      :before-close="closepProveDialog"
      :visible.sync="proveDialog.visible"
      width="35%">
      <el-form :model="proveDialogData" label-position="right" label-width="120px" class="dialog_form">
        <el-form-item label="审核结果：">
          <el-select v-model="proveDialogData.proveStatus" placeholder="请选择" clearable size="mini">
            <el-option v-for="option in  options.proveOptions" :key="option.key" :label="option.label" :value="option.key" />
          </el-select>
        </el-form-item>
        <el-form-item label="审核金额：">
          <el-input v-model="proveDialogData.provedCredit" placeholder="请输入审核金额" clearable/>

        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="closeProveDialog()">取消</el-button>
        <el-button type="primary" @click="confirmProveDialog()">保存</el-button>
      </div>
    </el-dialog>
  </div>
	</div>
</template>

<script>
	import SupplierApi from '@/api/basic/SupplierApi';
	import CustomerApi from '@/api/basic/CustomerApi';
  import appConstant from '@/constant/AppConstant';
  import AuthUtils from '@/utils/AuthUtils';
	import FinCustomerCreditApplicationApi from '@/api/baoli/FinCustomerCreditApplicationApi';
	export default {
		name: 'OmsSalesOrderList',
		data() {
			return {
				active: 1,
				value: '',
				name: '',
				options: {
					supplierIdOptions: [],
          proveOptions: appConstant.proveList,
					supplierOptions: []
				},
       proveDialog: {
          title: '审核',
          visible: false
        },
        proveDialogData: {
         proveStatus: null,
          provedCredit: null,
         id: null
        },
        finCustomerCreditApplication: {

        },


			}
		},
		created() {
      const id = this.$route.params.id
      if (id) {
        FinCustomerCreditApplicationApi.get(id).then(response => {
          this.finCustomerCreditApplication = response.data
        })
      }

			this.loadOptions()
		},
		methods: {

			goBack() {
				this.active = 1;
			},
      handleProve() {
        const id = this.$route.params.id

          this.proveDialog.visible = true
          this.proveDialogData.id = id
          this.proveDialogData.provedCredit = this.finCustomerCreditApplication.needCredit
      /* if (id) {
        FinCustomerCreditApplicationApi.prove(id).then(() => {
          this.$message.success('审核成功!')

        })
        FinCustomerCreditApplicationApi.get(id).then(response => {
          this.finCustomerCreditApplication = response.data
        })
       }*/
      },
      closeProveDialog() {
        this.proveDialog = {
          title: '审核',
          visible: false
        }
        this.proveDialogData = {
          proveStatus: null
        }
       FinCustomerCreditApplicationApi.get(id).then(response => {
         this.finCustomerCreditApplication = response.data
       })
      },
      confirmProveDialog() {
          const params = {
            proveStatus: this.proveDialogData.proveStatus,
            provedCredit: this.proveDialogData.provedCredit,
            id: this.proveDialogData.id
         }
          FinCustomerCreditApplicationApi.prove(params).then(() => {
            this.$message.success('审核成功!')
            this.closeProveDialog()
          })

      },
			loadOptions() {
				let that = this;

			},
			confirm() {
				FinCreditBillApi.submit(this.form).then(res =>{
					console.log(res)
				})
				this.active = 3;
				alert('提交成功')
				setTimeout(() => {
					this.active = 1;
				}, 1500);
				this.form = {
					salerNo: '',
					receiverNo: '',
					amount: '',
					openDate: '',
					validatedTo: '',
					contractNo: '',
					invoiceNo: '',
					remark: ''
				};
				this.dateBetween = '';
			},
      handleProveBtnShow: function(status) {
         const validStatusList = ['CREATED']
         const index = validStatusList.indexOf(status)
         if (index === -1) {
           return false
         } else {
           return true
         }
       },
			submitForm(formName) {
				this.$refs[formName].validate((valid) => {
					if (valid) {
						for(let i in this.options.supplierOptions){
							if(this.form.receiverNo == this.options.supplierOptions[i].id){
								this.name = this.options.supplierOptions[i].supplierName
								// return
							}
						}
						this.a = parseInt(this.form.amount / 100000000)
						this.b = parseInt(this.form.amount % 100000000 / 10000000)
						this.c = parseInt(this.form.amount % 100000000 % 10000000 / 1000000)
						this.d = parseInt(this.form.amount % 100000000 % 10000000 % 1000000 / 100000)
						this.e = parseInt(this.form.amount % 100000000 % 10000000 % 1000000 % 100000 / 10000)
						this.f = parseInt(this.form.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 /
							1000)
						this.g = parseInt(this.form.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 %
							1000 / 100)
						this.h = parseInt(this.form.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 %
							1000 % 100 / 10)
						this.i = parseInt(this.form.amount % 100000000 % 10000000 % 1000000 % 100000 % 10000 %
							1000 % 100 % 10 / 1)
						this.active = 2
						console.log(this.form.openDate)
						this.getDaysBetween(this.form.openDate, this.form.validatedTo)
					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},
			// *
			//  * 计算两个日期之间的天数
			//  * @param dateString1  开始日期 yyyy-MM-dd
			//  * @param dateString2  结束日期 yyyy-MM-dd
			//  * @returns {number} 如果日期相同 返回一天 开始日期大于结束日期，返回0
			getDaysBetween(dateString1, dateString2) {
				var startDate = Date.parse(dateString1);
				var endDate = Date.parse(dateString2);
				if (startDate > endDate) {
					return 0;
				}
				if (startDate == endDate) {
					return 1;
				}
				var days = (endDate - startDate) / (1 * 24 * 60 * 60 * 1000);
				this.dateBetween = days
			},
			smallToBig(money) {
				//  将数字金额转换为大写金额
				var cnNums = new Array(
					"零",
					"壹",
					"贰",
					"叁",
					"肆",
					"伍",
					"陆",
					"柒",
					"捌",
					"玖"
				); //汉字的数字
				var cnIntRadice = new Array("", "拾", "佰", "仟"); //基本单位
				var cnIntUnits = new Array("", "万", "亿", "兆"); //对应整数部分扩展单位
				var cnDecUnits = new Array("角", "分", "毫", "厘"); //对应小数部分单位
				var cnInteger = "整"; //整数金额时后面跟的字符
				var cnIntLast = "元"; //整数完以后的单位
				//最大处理的数字
				var maxNum = 999999999999999.9999;
				var integerNum; //金额整数部分
				var decimalNum; //金额小数部分
				//输出的中文金额字符串
				var chineseStr = "";
				var parts; //分离金额后用的数组，预定义
				if (money == "") {
					return "";
				}

				money = parseFloat(money);
				if (money >= maxNum) {
					//超出最大处理数字
					return "超出最大处理数字";
				}
				if (money == 0) {
					chineseStr = cnNums[0] + cnIntLast + cnInteger;
					return chineseStr;
				}

				//四舍五入保留两位小数,转换为字符串
				money = Math.round(money * 100).toString();
				integerNum = money.substr(0, money.length - 2);
				decimalNum = money.substr(money.length - 2);

				//获取整型部分转换
				if (parseInt(integerNum, 10) > 0) {
					var zeroCount = 0;
					var IntLen = integerNum.length;
					for (var i = 0; i < IntLen; i++) {
						var n = integerNum.substr(i, 1);
						var p = IntLen - i - 1;
						var q = p / 4;
						var m = p % 4;
						if (n == "0") {
							zeroCount++;
						} else {
							if (zeroCount > 0) {
								chineseStr += cnNums[0];
							}
							//归零
							zeroCount = 0;
							chineseStr += cnNums[parseInt(n)] + cnIntRadice[m];
						}
						if (m == 0 && zeroCount < 4) {
							chineseStr += cnIntUnits[q];
						}
					}
					chineseStr += cnIntLast;
				}
				//小数部分
				if (decimalNum != "") {
					var decLen = decimalNum.length;
					for (var i = 0; i < decLen; i++) {
						var n = decimalNum.substr(i, 1);
						if (n != "0") {
							chineseStr += cnNums[Number(n)] + cnDecUnits[i];
						}
					}
				}
				if (chineseStr == "") {
					chineseStr += cnNums[0] + cnIntLast + cnInteger;
				} else if (decimalNum == "" || /^0*$/.test(decimalNum)) {
					chineseStr += cnInteger;
				}
				this.value = chineseStr;
				console.log(this.value)
			}
		}
	}
</script>
<style scoped>
	.imgBg {
		width: 80%;
		margin: 0 auto;
		height: 430px;
		background-image: url("../../../assets/img/wenli.png");
		/*background: url("img/2.jpg") 10% 20% no-repeat;!*图片从左往右移动的百分比大小，从上往下百分比大小，重复方式
		                                                            换成数值同样如此，在这里没有调整大小的方法*!*/
		/*这个是按从左往右，从上往下的百分比位置进行调整*/
		background-size: 100% 100%;
		/*按比例缩放*/
		/*background-size: 100px 100px;!*这个是按数值缩放*!*/
		background-repeat: no-repeat;
		/*还有repeat-x,y等*/
	}

	.xindanBox {
		width: 95%;
		height: 450px;
		margin: 0 auto;
	}

	.topBox {
		display: flex;

	}

	.title {
		height: 100px;
		width: 40%;
		margin: 0 auto;
		margin-left: 30%;
	}

	.orderNo {
		height: 100px;
		width: 30%;
		margin-left: 50px;
	}

	.moneyBox {
		display: flex;
		height: 50px;
		width: 100%;
	}

	.moneyChildBox {
		width: 25%;
		height: 50px;
	}

	.textAlLine {
		text-align: center;
	}

	.eduTitle {
		/* margin-top: 30px; */
		color: #818181;
		font-size: 15px;
	}

	.redColor {
		color: #fd0000;
	}

	.titleNumber {
		margin-top: 10px;
		font-weight: bold;
	}

	.contentBox {
		width: 50%;
		margin: 0 auto;
		/* height: 300px; */
	}
</style>
